<template>
    <div >
      <div class="loginText">
          <h1 style="color:rgb(255,255,255);">登 录</h1>
          <br><br>
        <div class="input">
          <row>
              <Input v-model="username" prefix="ios-contact" placeholder="输入用户名"/>
          </row>
          <br>
          <row>
              <Input v-model="password" type="password" placeholder="输入密码" />
          </row>
        </div>
          <br>
          <Button v-on:click="login" type="primary" style="margin-right: 20px">用户登录</Button>

          <Button v-on:click="register">用户注册</Button>
      </div>
    </div>
</template>

<script>
    export default {
        name: 'Login',
        components: {},
        data() {
            return {
                password: '',
                username: ''
            }
        },
        created: function () {
        },
        methods: {
            login() {
                let data = {
                    password: this.password,
                    username: this.username
                }
                this.$api.post('users/login', data).then((res) => {
                    console.log(res.data)
                    this.$Notice.info({
                        title: '提示',
                        desc: res.message
                    });
                    if (res.code === 0) {//普通用户登录成功
                        sessionStorage.setItem('token', res.data.token)
                        sessionStorage.setItem('username', this.username)
                        this.$router.push({path: '/index'})
                    }else if(res.code === 2){ //管理员登录成功
                      sessionStorage.setItem('token', res.data.token)
                      sessionStorage.setItem('username', this.username)
                      this.$router.push({path: '/admin'})
                    }
                    else {
                        sessionStorage.removeItem('token')
                    }
                })
            },
            register() {
              //跳转到注册页面
                this.$router.push({path: 'register'})
            }
        }
    }
</script>
`
<style scoped>

.loginText{
  text-align: center;
  margin-top: 200px;
}

.input{
  margin-left: 35%;
  width: 30%;
}
</style>